Styling in JavaScript with Styled-Components
from Test-Driven React, Second Edition
『styled-components を使った JavaScript のスタイリング』
CSS-in-JS を用いると、スタイルルールを単体テストの対象とすることが可能
warning.icon TDD はコードに対してできるだけ早く、有益なフィードバックを積極的に求めることを目的としている
有益なフィードバックを積極的に求める
より具体的には、建設的なフィードバックループを自分で設定し、潜在的な問題を迅速に特定し、潜在的な改善のために自由に探求できる環境を作り出すこと
テストはその手段の 1 つでしかない
時にはテスト以外のフィードバック源に焦点を当てるべきことも
e.g. スタイル
実際にスタイルを見ることが最も有用なフィードバックとなることが多い
そのため、スタイルに関してはテストを後から記述する のも手である
行き詰まったら、現在の求めているフィードバックの種類が誤っているのかも?
e.g.
styled-components による生成されたスタイルのテスト: styled-components#66d8000e75d04f0000a83ce1
スナップショットテスト: Vitest#66d8091e75d04f0000a83d80